import React, { Component } from 'react'
import PropTypes from 'prop-types';
import {connect} from 'react-redux';
import {selUserById} from '../../../actions/testAction'
import {
    View,
    Text,
}from 'react-native'

class TestInfo extends Component {

    static navigationOptions = {
        title: '用户详情示例',
        cardStack: {
            gesturesEnabled: false  // 是否可以右滑返回
        }
    };

    //页面加载后服务获取数据更新页面
    componentDidMount(){
        this.props.selUserById(this.props.navigation.state.params.userId);
    }

    render() {
        const {userInfo} = this.props.userInfo.data;
        return (
            <View >
                <Text>{userInfo.id}</Text>
                <Text>{userInfo.name}</Text>
                <Text>{userInfo.pwd}</Text>
                <Text>{userInfo.phone}</Text>
            </View>
        )
    }

}

TestInfo.propTypes = {
    userInfo:PropTypes.shape({
            id:PropTypes.number,
            name: PropTypes.string,
            pwd:PropTypes.string,
            phone: PropTypes.string
        })
};

//连接state到props
const mapStateToProps = state => {
    return{
        userInfo: state.selUserByIdReducer
    }
}

//导出组合好的组件(此处传入单个action)
export default connect(
    mapStateToProps,{selUserById}
)(TestInfo);